const path = require('path');

function resolve(dir) {
  return path.join(__dirname, dir)
}

// console.log(process.env.NODE_ENV)

module.exports = {
  /**
   * You will need to set publicPath if you plan to deploy your site under a sub path,
   * for example GitHub Pages. If you plan to deploy your site to https://foo.github.io/bar/,
   * then publicPath should be set to "/bar/".
   * In most cases please use '/' !!!
   * Detail: https://cli.vuejs.org/config/#publicpath
   */
  publicPath: '/',
  outputDir: 'dist',
  assetsDir: 'static',// build时会把css和js收进assetsDir中
  lintOnSave: false,
  productionSourceMap: false,
  /* 多入口配置 (除了 entry 之外都是可选的) */
  /**
    tips:
    当在 multi-page 模式下构建时，webpack 配置会包含不一样的插件 (这时会存
    在多个 html-webpack-plugin 和 preload-webpack-plugin 的实例)。如果
    你试图修改这些插件的选项，请确认运行 vue inspect。
   */
  pages: {
    // index: 'src/pages/index/main.ts'
    index: {
      // entry for the page
      entry: 'src/pages/index/main.ts',
      // the source template
      template: 'public/index.html',
      // output as dist/index.html
      filename: 'index.html',
      // when using title option,
      // template title tag needs to be <title><%= htmlWebpackPlugin.options.title %></title>
      title: 'Index Page',
      // chunks to include on this page, by default includes
      // extracted common chunks and vendor chunks.
      chunks: ['chunk-vendors', 'chunk-libs', 'chunk-common', 'index']
    },
    canvas: {
      entry: 'src/pages/canvas/main.ts',
      // template: 'public/canvas.html',
      // filename: 'canvas.html',
      title: 'Canvas Page',
    },
    blog: {
      entry: 'src/pages/blog/main.ts',
      title: 'Blog Page',
    }
    /**
      // 当使用只有入口的字符串格式时，
      // 模板会被推导为 `public/subpage.html`
      // 并且如果找不到的话，就回退到 `public/index.html`。
      // 输出文件名会被推导为 `subpage.html`。
      // subpage: 'src/subpage/main.js'
     */
  },
  devServer: {
    port: 8001,
    open: false,
    overlay: {
      warnings: false,
      errors: true
    },
    // before: require('./mock/mock-server.js')
  },
  configureWebpack: {
    // 覆盖 webpack's name 使 index.html 插入正确的 title.
    name: 'vue-next',
    resolve: {
      alias: {
        '@': resolve('src')
      }
    }
  },
  chainWebpack(config) {
    // tips: set svg-sprite-loader
    config.module
      .rule('svg')
      .exclude.add(resolve('src/assets/svg'))
      .end()
    config.module
      .rule('icons')
      .test(/\.svg$/)
      .include.add(resolve('src/assets/svg'))
      .end()
      .use('svg-sprite-loader')
      .loader('svg-sprite-loader')
      .options({
        // [name],即原始svg的id值
        symbolId: 'icon-[name]'
      })
      .end()
      }
};

/*
chainWebpack(config) {
  // tips: 它可以提高第一屏的速度，建议打开预加载
// config.plugin('preload').tap(() => [
//   {
//     rel: 'preload',
//     // to ignore runtime.js
//     // https://github.com/vuejs/vue-cli/blob/dev/packages/@vue/cli-service/lib/config/app.js#L171
//     fileBlacklist: [/\.map$/, /hot-update\.js$/, /runtime\..*\.js$/],
//     include: 'initial'
//   }
// ])

// tips: 删除预请求: 当有很多页面时，会导致太多无意义的请求
// config.plugins.delete('prefetch')

// tips: set svg-sprite-loader
// config.module
//   .rule('svg')
//   .exclude.add(resolve('src/icons'))
//   .end()
// config.module
//   .rule('icons')
//   .test(/\.svg$/)
//   .include.add(resolve('src/icons'))
//   .end()
//   .use('svg-sprite-loader')
//   .loader('svg-sprite-loader')
//   .options({
//     symbolId: 'icon-[name]'
//   })
//   .end()

config
  .when(process.env.NODE_ENV !== 'development',
    config => {
      // config
      //   .plugin('ScriptExtHtmlWebpackPlugin')
      //   .after('html')
      //   .use('script-ext-html-webpack-plugin', [{
      //     // `runtime` must same as runtimeChunk name. default is `runtime`
      //     inline: /runtime\..*\.js$/
      //   }])
      //   .end()
      config
        .optimization.splitChunks({
          chunks: 'all',
          cacheGroups: {
            libs: {
              // 默认name为`chunk-vendors`
              name: 'chunk-libs',
              test: /[\\/]node_modules[\\/]/,
              priority: 10,
              // 仅包装最初依赖的第三方
              chunks: 'initial'
            },
            elementUI: {
              // 将elementUI拆分为单个包
              name: 'chunk-elementUI',
              // 权重需要大于libs和app，否则将打包成libs或app
              priority: 20,
              // in order to adapt to cnpm
              test: /[\\/]node_modules[\\/]_?element-ui(.*)/
            },
            commons: {
              name: 'chunk-commons',
              // 自定义优化的对象
              test: resolve('src/components'),
              //  minimum common number
              minChunks: 3,
              priority: 5,
              reuseExistingChunk: true
            }
          }
        })
      // https://webpack.js.org/configuration/optimization/#optimizationruntimechunk
      config.optimization.runtimeChunk('single')
    }
  )
}
*/
